<template>
  <div class="broadcast">
    <m-header modile-title="列表" no-back="true"></m-header>
    <yd-scrollnav>
      <yd-scrollnav-panel :label="item.label" v-for="(item,index) in list" :key="index">

        <!-- 内容 -->
        <p>{{item.label}}</p>
        <yd-list>
          <yd-list-item v-for="(n,index2) in 10" :key="index2">
            <img slot="img" src="../../../src/assets/images/noImage.png" alt="">
            <span slot="title">{{item.label}} - {{item.label}}</span>
          </yd-list-item>
        </yd-list>
        <!-- 内容 -->

      </yd-scrollnav-panel>
    </yd-scrollnav>
    <m-footer></m-footer>
  </div>
</template>

<script>
  import mHeader from '../../components/header'
  import mFooter from '../../components/Footer'

  export default {
    data() {
      return {
        list: [
          {label: '今日特惠'},
          {label: '烟灶推荐'},
          {label: '净水饮水推荐'},
          {label: '洗碗机推荐'},
          {label: '电热推荐'},
          {label: '燃热推荐'},
          {label: '消毒柜推荐'},
          {label: '嵌入式推荐'},
          {label: '商用电器'},
          {label: '活动说明'}
        ]
      }
    },
    mounted() {

    },
    methods: {},
    components: {
      mHeader,
      mFooter
    }
  }
</script>
<style lang="scss">
  .broadcast {
    .yd-scrollnav {
      top: 44px;
    }
    .yd-scrollnav-content {
      div {
        p {
          line-height: 40px;
          margin-left: 10px;
          font-size: 15px;
        }
      }
      .yd-list-mes {
        text-align: center;
        .yd-list-title {
          text-align: center;
        }
      }
    }
  }
</style>
